<template>
  <div id="player">
    



  </div>
</template>
<script>
export default {
  data() {
    return {
      vodPlayerJs: 'https://player.polyv.net/script/player.js',
      vid:'88083abbf5bcf1356e05d39666be527a_8',
    };
  },

  mounted(){
      this.loadPlayerScript(this.loadPlayer);


  },

  methods: {
    loadPlayerScript(callback) {
      if (!window.polyvPlayer) {
        const myScript = document.createElement('script');
        myScript.setAttribute('src', this.vodPlayerJs);
        myScript.onload = callback;
        document.body.appendChild(myScript);
      } else {
        callback();
      }
    },

    loadPlayer() {
      const polyvPlayer = window.polyvPlayer;
      
      this.player = polyvPlayer({
        wrap: '#player',
        width: 388.8,
        height: 218.7,
        vid: this.vid ,
        loading_bg_img: "http://rfly.buaa.edu.cn/images/news/20200829Graduate.jpg",
        autoplay: false,
        cover_opacity: 0,
        ban_ui : this.ban_ui_text,
      });
      this.player.on('s2j_onPlayStart', function(e) {
        this.ban_ui_text = "off";
        console.log('s2j_onPlayStart');
      });  
    }
  },
  destroyed() {
    if (this.player) {
        this.player.destroy();
    }
  }
};
</script>


<style lang="less" scoped>


</style>

